<template>
	<div id="page">
		<nav-bar></nav-bar>

		<div class="main">
			<div v-for="(item,index) in img">
				<img :src="item">
			</div>

			<!-- <div class="col">
				<div class="box" v-for="(item,index) in boxDatd" >
						<img class="img" :src="item.img" >
						<p class="name">{{item.name}}</p>
					<a :href="getURL(item.url)">
						<div class="btn btn-c-lan">Open link</div>
					</a>
				</div>
			</div> -->


		</div>
	</div>
</template>

<script>
	import navBar from "../components/navBar.vue"
	export default {
		name: "certificates",
		components: {
			navBar
		},
		data() {
			return {
				img: [
          require('../assets/certificates/1.png'),
          require('../assets/certificates/2.png'),
          require('../assets/certificates/3.png'),
          require('../assets/certificates/4.png'),

				],
				boxDatd: [{
					img: require('../assets/indx/NFA.png'),
					name: 'chessge-NFA',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/chssgy-NFA_1_.pdf'
				}, {
					img: require('../assets/indx/FinCEN.png'),
					name: 'chessgy-msb',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/chssgy_msb.pdf'
				}, {
					img: require('../assets/indx/zs8.png'),
					name: this.$t('index.zc'),
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/zczs.pdf'
				}, {
					img: require('../assets/indx/zs2.png'),
					name: 'Register of Members',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/cydjsc.pdf'
				}, {
					img: require('../assets/indx/zs1.png'),
					name: 'Establishment document',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/clwj.pdf'
				}, {
					img: require('../assets/indx/zs3.png'),
					name: '公司章程',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/gszc.pdf'
				}, {
					img: require('../assets/indx/zs4.png'),
					name: '股票证书',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/gpzs.pdf'
				}, {
					img: require('../assets/indx/zs5.png'),
					name: '会议记录',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/hyjl.pdf'
				}, {
					img: require('../assets/indx/zs6.png'),
					name: '良好证书',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/lhzs.pdf'
				}, {
					img: require('../assets/indx/zs7.png'),
					name: '在职证明',
					url: 'https://hk-y0059.oss-cn-hongkong.aliyuncs.com/zzzm.pdf'
				}]

			}
		},
		methods: {
			getURL(url) {
				let strURL = "";
				if (url.substr(0, 7).toLowerCase() == "http://" || url.substr(0, 8).toLowerCase() == "https://") {
					strURL = url;
				} else {
					strURL = "http://" + url;
				}
				return strURL;

			}
		}
	}
</script>

<style lang="scss" scoped>
	#page {
		background: #FFF;
	}

	.main {
		margin-top: 120px;
		height: calc(100% - 120px);
		position: relative;
		z-index: 1;
		overflow: scroll;
		background: #f4f5ef;

		img {
			width: 100%;
		}
	}

	.col {
		padding: 25px;

		.box {
			display: inline-block;
			width: 300px;
			margin: 25px;
			border: 3px solid #07ACCA;
			box-sizing: border-box;
			text-align: center;
			padding: 30px;

			border-image: -webkit-linear-gradient(#5ef2ff, #1368f8) 30 30;
			border-image: -moz-linear-gradient(#5ef2ff, #1368f8) 30 30;
			border-image: linear-gradient(#5ef2ff, #1368f8) 30 30;
			box-shadow: 0 0 30px 1px #bbb;




			.img {
				height: 150px;
				margin: 20px auto;
			}

			.name {
				color: #666;
				margin: 20px 0px;
			}

			.btn {
				border-radius: 60px;
				margin: 20px 30px;
				height: 60px;
				line-height: 60px;
			}

		}

	}
</style>
